import React from 'react';
import { BrowserRouter, Routes, Route } from "react-router-dom";
import './App.css';
import { tonmi } from 'tonmi';
import {sitemaps, RouteInterface} from './sitemap';


const RouteWithSubRoutes = (route: RouteInterface, index: number) => {
  return (<Route key={index} path={route.path} element={<route.component routes={route.routes} />} />);
}

function App() {
  return (
    <div className="App">
      <header className="App-header">
      <BrowserRouter>
      <Routes>
        {sitemaps.map((route: RouteInterface, i: number) => { return RouteWithSubRoutes(route, i)})}
      </Routes>
      </BrowserRouter>
      </header>
    </div>
  );
}

export default App;
